
// Count组件相关的模块化
const countOptions = {
    // 如果在使用模块化的时候，如果想在mapState里面通过第一个参数指定分类的话，就必须指定namespaced 参数才可以
    // 默认namespaced是false
    namespaced: true,
    actions: {
        // 使用es6中对象的简写形式，可以省略冒号:function()。
        incrementOdd(context, value) {
            // 参数一是一个mini版本的Store，命名为context，意味着上下文。
            // 参数二就是传递的参数值。
            console.log('Actions里面的 incrementOdd 被调用了！', context, value);
            // 此处的Action调用commit，走到Mutations
            if (context.state.sum % 2) {
                context.commit('INCREMENT', value)
            }
        },

        // 使用es6中对象的简写形式，可以省略冒号:function()。
        incrementWait(context, value) {
            // 参数一是一个mini版本的Store，命名为context，意味着上下文。
            // 参数二就是传递的参数值。
            console.log('Actions里面的 incrementWait 被调用了！', context, value);
            // 此处的Action调用commit，走到Mutations
            setTimeout(() => {
                context.commit('INCREMENT', value)
            }, 500)
        }
    },
    mutations: {
        // 自定义快捷键：
        // 转换为大写：Ctrl + Alt + U
        // 转换为小写：Ctrl + Alt + L
        INCREMENT(state, value) {
            // 参数一是state，且这个state是一个对象，此处检测数据改变的原理和vue是一样的。
            // 参数二value，就是传递的参数值
            console.log('Mutations里面的 INCREMENT 被调用了！', state, value);
            state.sum += value;
        },

        DECREMENT(state, value) {
            // 参数一是state，且这个state是一个对象，此处检测数据改变的原理和vue是一样的。
            // 参数二value，就是传递的参数值
            console.log('Mutations里面的 DECREMENT 被调用了！', state, value);
            state.sum -= value;
        },

        // INCREMENTODD(state, value) {
        //     // 参数一是state，且这个state是一个对象，此处检测数据改变的原理和vue是一样的。
        //     // 参数二value，就是传递的参数值
        //     console.log('Mutations里面的 INCREMENTODD 被调用了！', state, value);
        //     state.sum += value;
        // },

        // INCREMENTWAIT(state, value) {
        //     // 参数一是state，且这个state是一个对象，此处检测数据改变的原理和vue是一样的。
        //     // 参数二value，就是传递的参数值
        //     console.log('Mutations里面的 INCREMENTWAIT 被调用了！', state, value);
        //     state.sum += value;
        // }
    },
    state: {
        sum: 0,// 当前的和
        school: '尚硅谷',
        subject: 'Vue2 && Vue3',
    },
    getters: {
        // 可以使用对象的简写形式
        // bigSum:function(state) {
        //     return state.sum * 10;
        // },

        // 参数是state
        bigSum(state) {
            return state.sum * 10;
        }
    }
}

// 默认导出
export default countOptions;
